<!DOCTYPE html>
<html lang="ch" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>同乡烩支付</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />
    <link th:href="@{css/user_pay.css}" rel="stylesheet" type="text/css" />
    <script th:src="@{js/jquery-3.4.1.js}"></script>
</head>
<body>

<section class="aui-flexView">
    <header class="aui-navBar aui-navBar-fixed">
        <a href="javascript:;" class="aui-navBar-item">
            <i class="icon icon-return"></i>
        </a>
        <div class="aui-center">
            <span class="aui-center-title"></span>
        </div>
        <a href="javascript:;" class="aui-navBar-item">
            <i class="icon icon-sys"></i>
        </a>
    </header>
    <section class="aui-scrollView">
        <div class="aui-flex aui-flex-gradual">
            <div class="aui-flex-user">
                <img th:src="@{images/user-001.png}" alt="">
                <span class="aui-flex-vip">
                        <img th:src="@{images/icon-vip.png}" alt="">
                    </span>
            </div>
            <div class="aui-flex-box">
                <h2>[[${payorder.account}]]</h2>
                <p>
                    <em>[[${session.role}]]</em>
                </p>
            </div>
        </div>
        <div class="aui-flex-member-list">
            <h2>总价格</h2>
            <ul class="aui-cho-box">
                <li class="aui-flex on">
                    <div class="aui-flex-box">
                        <h3>
                            普通支付

                            <em class="aui-flex-box-tj">
                                <img th:src="@{images/icon-tj.png}" alt="">
                            </em>
                        </h3>
                        <p>订单号：[[${payorder.orderid}]]</p>
                    </div>
<!--                    <div class="aui-original-thj">-->
<!--                        特惠价 <i>￥</i>-->
<!--                    </div>-->
                    <i class="aui-price">￥[[${payorder.price}]]</i>
                </li>
            </ul>
            <div style="display:none">
                <input name="" type="text" value="1" class="auiSks" />
            </div>
            <div class="chi">
                <div class="aui-flex b-line" style="padding:15px 0">
                    <div class="aui-flex-wx">
                        <img th:src="@{images/icon-wx.png}" alt="">
                    </div>
                    <div class="aui-flex-box aui-flex-box-clear">
                        <h4>
                            微信支付


                            <em class="aui-flex-box-tj">
                                <img th:src="@{images/icon-tj.png}" alt="">
                            </em>
                        </h4>
                        <p>亿万用户的选择，更快更安全</p>
                    </div>
                    <div class="aui-payment-method">
                        <label class="cell-right">
                            <input type="radio" name="radio" value="wx" checked="checked">
                            <i class="cell-radio-icon"></i>
                        </label>
                    </div>
                </div>
                <div class="aui-flex b-line" style="padding:15px 0">
                    <div class="aui-flex-wx">
                        <img th:src="@{images/icon-zfb.png}" alt="">
                    </div>
                    <div class="aui-flex-box">
                        <h4>支付宝支付</h4>
                        <p>亿万用户的选择</p>
                    </div>
                    <div class="aui-payment-method">
                        <label class="cell-right">
                            <input type="radio" name="radio" value="zfb">
                            <i class="cell-radio-icon"></i>
                        </label>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <footer class="aui-tabBar aui-tabBar-fixed">
        <button class="aui-tabBar-btn">去支付</button>
    </footer>
</section>
<script type="text/javascript">
    $(function () {
        $(".aui-tabBar-btn").click(function () {
            $.ajax({
                url:"/weixinpay",
                dataType:"json",
                type:"get",
                data:{
                    orderid:[[${payorder.orderid}]],
                },
                success:function (data){
                    if (data===1){
                        alert("支付成功")
                        window.location.href="/user_order.html"
                    }else {
                        alert("支付失败，请检查网络")
                    }
                }
            })
        })
    })
</script>
</body>
</html>

